<template>
	<view class="content-tabar">
		<view class="header">
			<view class="header-my">我的</view>
			<view class="header-info flex-row">
				<image class="header-info-img" src="../../static/user/head-img.png" mode="widthFix"></image>
				<view class="flex-column header-info-naph">
					<view class="header-info-name" v-if="isLogin===false" @tap="gologin">昵称/登录</view>
					<view class="header-info-name" v-if="isLogin===true">沐雨轩</view>
					<view class="header-info-phone" v-if="isLogin==true">12345678910</view>
				</view>
			</view>
		</view>
		<view class="order">
			<view class="order-cento flex-column">
				<view class="order-cento-header flex-row flex-content-between flex-item-center">
					<view class="order-cento-header-txt1">我的订单</view>
					<view class="flex-row order-cento-header-img" @tap="goorder">
						<view class="order-cento-header-txt2">全部订单</view>
						<image class="order-cento-header-img1" src="../../static/index/youbian.png" mode="scaleToFill"></image>
					</view>
				</view>
				<view class="flex-row flex-content-between order-cento-order">
					<view class="flex-column order-cento-item">
						<image src="../../static/user/dfh.png" mode="scaleToFill"></image>
						<view>待发货</view>
					</view>
					<view class="flex-column order-cento-item">
						<image src="../../static/user/dsh.png" mode="scaleToFill"></image>
						<view>待收货</view>
					</view>
					<view class="flex-column order-cento-item">
						<image src="../../static/user/th.png" mode="scaleToFill"></image>
						<view>退款/售后</view>
					</view>
				</view>
			</view>
		</view>
		<view class="sh flex-row flex-content-between flex-item-center" @tap="goadd">
			<view class="flex-row sh-txt">
				<image src="../../static/user/lj.png" mode="scaleToFill"></image>
				<view>收货地址</view>
			</view>
			<image src="../../static/index/youbian.png" mode="scaleToFill"></image>
		</view>
		<view class="buttons">退出登录</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				isLogin:false
			}
		},
		methods:{
			gologin(){
				uni.navigateTo({
					url:'/pages/user/login'
				})
			},
			goorder(){
				uni.navigateTo({
					url:'/pages/order/order_list'
				})
			},
			goadd(){
				uni.navigateTo({
					url:'/pages/user/address_list'
				})
			}
		}
	}
</script>

<style lang="scss">
	.buttons{
		width: 690rpx;
		height: 100rpx;
		text-align: center;
		line-height: 100rpx;
		background-color: $default-button-color;
		color: $default-button-foncolor;
		margin-left: 30rpx;
		border-radius: 50rpx 50rpx 50rpx 50rpx;
		margin-top: 30rpx;
	}
	.sh-txt{
		margin-left: 30rpx;
		>image:nth-child(1){
			width: 27rpx;
			height: 30rpx;
			margin-top: 5rpx;
		}
		>view:nth-child(2){
			font-size: 28rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #333333;
			margin-left: 10rpx;
		}
	}
	.sh{
		width: 750rpx;
		height: 100rpx;
		background-color: #FFFFFF;
		margin-top: 20rpx;
		>image:nth-child(2){
			width: 12rpx;
			height: 22rpx;
			margin-right: 30rpx;
		}
	}
	.order-cento-order{
		margin-top: 30rpx;
		margin-left: 30rpx;
		margin-right: 44rpx;
	}
	.order-cento-item{
		line-height: 60rpx;
		align-items: center;
		>image:nth-child(1){
			width: 54rpx;
			height: 42rpx;
		}
		>view:nth-child(2){
			font-size: 24rpx;
			font-family: PingFang SC-Regular, PingFang SC;
			font-weight: 400;
			color: #333333;
			text-align: center;
		}
	}
	.order-cento-header-img{
		
	}
	.order-cento-header-img1{
		width: 12rpx;
		height: 22rpx;
		margin-top: 25rpx;
		margin-left: 15rpx;
	}
	.order-cento-header-txt1{
		font-size: 28rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #333333;
		line-height: 78rpx;
	}
	.order-cento-header-txt2{
		font-size: 28rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #333333;
		line-height: 78rpx;
	}
	.order-cento-header{
		height: 78rpx;
		border-bottom: 2rpx solid #F4F4F4;
	}
	.order-cento{
		margin-left: 20rpx;
		margin-top: 18rpx;
		margin-right: 20rpx;
	}
	.order{
		width: 690rpx;
		height: 224rpx;
		background-color: #FFFFFF;
		margin-left: 30rpx;
		margin-top: 30rpx;
	}
	.header{
		width: 750rpx;
		height: 420rpx;
		background-image: url('../../static/user/bg.png');
		background-size: 100%;
	}
	.header-my{
		padding-top: 110rpx;
		font-size: 34rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: #FFFFFF;
		text-align: center;
	}
	.header-info{
		margin-top: 72rpx;
		margin-left: 30rpx;
	}
	.header-info-img{
		width: 104rpx;
		border-radius: 52rpx;
	}
	.header-info-naph{
		margin-left: 20rpx;
	}
	.header-info-name{
		font-size: 28rpx;
		font-family: PingFang SC-Bold, PingFang SC;
		font-weight: bold;
		color: $default-button-foncolor;
		// margin-left: 20rpx;
	}
	.header-info-phone{
		font-size: 24rpx;
		font-family: PingFang SC-Regular, PingFang SC;
		font-weight: 400;
		color: #FFFFFF;
		margin-top: 10rpx;
		
	}
</style>